
.border{height:1px ; background:#eee;box-shadow: 0 6px 21px rgb(0 0 0 / 7%); margin:0 24px;  position:relative}
.border::before{content: "";position: absolute;bottom:-1px;left:50%;width:100px;height:3px;box-sizing: border-box;background: linear-gradient(180deg,#e60012,#e60012);border-radius: 3px;
margin-left:-50px;}

.main{ margin:0 auto; position:relative;  width:100%; max-width:1230px;}



#topbox{ width:100%; color:#fff; height:40px;line-height:40px;  overflow:hidden;background:#272b2e; position:relative; top:0;font-size:12px;z-index:9923;box-shadow: 0 3px 12px rgb(0 0 0 / 7%);}
.topleft{ float:left; margin-left:24px }
.topright{ float:right;text-align:right;margin-right:24px}
.topright a{ color:#fff;}
.topright span{margin-right:18px;font-family:Arial, Helvetica, sans-serif}
.topright .linka{background:url(../images/cn.jpg) no-repeat left center; padding-left:24px; margin:0 9px; font-size:12px}
.topright .linkb{background:url(../images/en.jpg) no-repeat left center;  padding-left:24px; margin:0 9px; font-size:12px; font-family:Arial, Helvetica, sans-serif}
.lan{ background:linear-gradient(145deg,#666,#666 120%);border-radius:30px; overflow:hidden; float:right; margin:8px 0; line-height:24px; padding:0 9px; position:relative}
.lan::before{ content: ""; position: absolute; top:25%; left: 51%; width:1px; height:50%; background:#999;  }



/*导航*/
.headerHeight{ height:90px} 
header{height:90px;width:100%;transition:all .3s;position:fixed;left:0;top:40px; background:#fff; z-index:9913; color:#333 ;box-shadow: 0 6px 21px rgb(0 0 0 / 12%); }
header.fix1,header.fix{ color:#333;webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px); background-color: rgba(255, 255, 255, 1);
box-shadow: 0 6px 21px rgb(0 0 0 / 7%);position:fixed;left:0;top:0;z-index:9933;}
header.fix1 .logo-text,header.fix .logo-text{border-color:#ccc;}

#nav{  margin:0 auto;width:100%; max-width: 1230px;/*border-bottom:1px solid #fff;*//*border-bottom:1px solid rgba(34,100,112,0.1);*/display:flex;justify-content:space-between}

/*logo左侧*/
.header-left{display:flex;align-items:center; margin-left:24px}
.header-left .logo{height: 90px;  object-fit: fill; object-fit: contain; object-fit: scale-down;  }
.logo-text{padding-left:12px;margin-left:12px;border-left:1px solid #ddd;}
.logo-text p.t1{font-size:14px;line-height:1.5;color:#666}
.logo-text p.t2{font-size:14px;line-height:1.5;color:#666}


/*右侧按钮*/
.header-right{align-items:center;display:flex;height:90px;margin-right:24px}
.header-right > a{float:left;line-height:1;display:inline-block;margin-right:30px;color:inherit;}
.header-right a.top-tool:hover span{opacity:1;}
.header-right .top-tool span{color:inherit;font-size:30px;}
.header-right .top-tool.active span{opacity:1;}

header .menu-handler{position:relative;z-index:100;width:30px;height:30px;cursor:pointer;transition:all 0.3s cubic-bezier(0.445,0.145,0.355,1);-webkit-transition:all 0.3s cubic-bezier(0.445,0.145,0.355,1);-moz-transition:all 0.3s cubic-bezier(0.445,0.145,0.355,1);}
header .menu-handler.active{background-color:transparent;}
header .menu-handler .trans{-webkit-transition:all 0.6s cubic-bezier(0.245,0.145,1.355,1);-moz-transition:all 0.6s cubic-bezier(0.445,0.145,0.355,1);-o-transition:all 0.6s cubic-bezier(0.445,0.145,0.355,1);-ms-transition:all 0.6s cubic-bezier(0.445,1.045,0.355,1);transition:all 0.6s cubic-bezier(0.445,0.145,0.355,1);}
header .menu-handler .trans-fast{-moz-transition:all 0.5s ease-in;-webkit-transition:all 0.5s ease-in;-o-transition:all 0.5s ease-in;-ms-transition:all 0.5s ease-in;transition:all 0.5s ease-in;}
header .menu-handler .burger{position:absolute;width:30px;height:3px;z-index:99;left:0;top:2px;display:block;margin:0;border-radius:0;background:#000;transform-origin:center;-webkit-transform-origin:center;-moz-transform-origin:center;-o-transform-origin:center;-ms-transform-origin:center;}
header.fix1 .menu-handler .burger,header.fix .menu-handler .burger{background:#000;}

header .menu-handler .burger-2{top:15px;}
header .menu-handler .burger-3{top:27px;}
header .menu-handler.active .burger{background:#333;}
header .menu-handler.active .burger-1{left:0;top:15px;width:30px;-moz-transform:rotate(225deg);-webkit-transform:rotate(225deg);-o-transform:rotate(225deg);-ms-transform:rotate(225deg);transform:rotate(225deg);}
header .menu-handler.active .burger-2{filter:alpha(opacity=0);opacity:0;}
header .menu-handler.active .burger-3{left:0;top:15px;width:30px;-moz-transform:rotate(-225deg);-webkit-transform:rotate(-225deg);-o-transform:rotate(-225deg);-ms-transform:rotate(-225deg);transform:rotate(-225deg);}
header .header-right .menu-txt{line-height:25px;margin-left:14px;}




/* 导航 */
.menuDl{display:flex;}
.menuDl dd{float:left;display:inline;padding:0 12px}
.menuDl dd:hover .twoMenu .li a{opacity:1;visibility:visible;-webkit-transform:perspective(100px) rotateX(0deg);-ms-transform:perspective(100px) rotateX(0deg);transform:perspective(100px) rotateX(0deg);}
.topMenu{z-index:9;height:90px;display:flex;align-items:center;}
.topMenu > a{display:block;text-align:center;font-size:17px;position:relative;color:inherit;}
/**
.topMenu > a::before{content:"";position:absolute;top:30px;left:0;width:0;height:100%;border-bottom:3px solid #fff;transition:0.2s all linear;}
.topMenu:hover > a::before{width:100%;left:0;transition-delay:0.1s;z-index:-1;}
**/
.topMenu:hover .twoMenu{top:90px;transform:scaleY(1) translateZ(0);opacity:1;}
.twoMenu{position:absolute;top:90px;box-shadow: 0 0px 12px rgb(0 0 0 / 7%); transform-origin:50% 0;transform:scaleY(0) translateZ(0);opacity:0;transition:transform 0.3s,opacity 0.3s; 
left:50%;margin-left:-100px; width:200px; display:flex; justify-content:center}
.twoMenu a{font-size:14px;transition:0.3s ease; color:#fadee0}
.twoMenu a:hover{color:#fff;}
.twoMenu .menuContent{padding:0 24px;background:#e60012;margin:0 auto; border-radius:3px;filter:drop-shadow( 0 0px 12px rgb(0 0 0 / 7%));}
.twoMenu .menuContent::before{ content: ""; position: absolute; top:-6px; left: 50%; width:16px; height:16px;box-sizing: border-box; margin-left:-8px;display: inline-block; transform: rotate(-45deg); background: conic-gradient(from 90deg at 0 0, #e60012 0, #e60012 45deg, transparent  45.1deg); }


/*产品列表 yab520*/
ul.t-about{ overflow:hidden; padding:12px 0}
ul.t-about li a{display:block;text-align:center;line-height:35px; white-space:nowrap;}


img.up-pic {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 2;*height: auto; /*object-fit: fill; object-fit: contain; object-fit: scale-down;*/}
img.up-picAuto {position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 2;*height: auto; object-fit: fill; object-fit: contain; object-fit: scale-down;}






/*弹窗菜单*/
.nav-tog-main{background:#f8f8f8;position:fixed;width:100%;height:auto;z-index:0;left:0;top:0;overflow:hidden;display:none;}
.nav-tog-main.active{-moz-transition:all 0.3s ease-out;-webkit-transition:all 0.3s ease-out;-o-transition:all 0.3s ease-out;-ms-transition:all 0.3s ease-out;transition:all 0.3s ease-out;display:flex;align-items:center;  z-index:3333; background:#fff }
.nav-tog-main .item{ overflow:hidden}
.nav-tog-main .item .item-list{width:100%;display:flex;align-items:stretch;justify-content:space-between;}
.nav-tog-main .item dl{text-align:left;padding:0 24px;}
.nav-tog-main .item .item-list dl:first-child{}
.nav-tog-main .item dl dt{font-size:24px;margin-bottom:18px;position:relative;display:inline-block;}
.nav-tog-main .item dl dd{margin-top:12px;}
.nav-tog-main .item dl dd a{font-size:16px;display:inline-block;}
.nav-tog-main .item dl dd a:hover{outline:none;}





/*通用鼠标经过特效*/
.list_item .scontent{padding:18px;line-height: 150%;overflow:hidden; text-align:left ; background:#fff;border-radius:0 0 3px 3px}
.list_item .scontent .date { font-size:14px; color:#666;}
.list_item .scontent .name {  font-size:16px; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; margin:6px 0 }
.list_item .scontent .font {overflow: hidden;display: -webkit-box; word-break: break-all;text-overflow: ellipsis;  -webkit-box-orient: vertical;-webkit-line-clamp:2; color:#999; font-size:14px;height:50px}
.list_item .scontent .text {overflow: hidden;color:#999; font-size:14px; line-height:150%}

.list_item{display: block; overflow: hidden;border-radius:3px;margin:12px;position:relative; box-shadow: 0 0px 12px rgb(0 0 0 / 10%);}
.list_item .img-box{display: block;position: relative; overflow: hidden;background:#e8e9e8;box-shadow: 0 0px 24px rgb(0 0 0 / 10%);}
.list_item .img-box img{width: 100%; transform: translateZ(0px); transition: transform 0.3s ease 0s; }
.list_item:hover .img-box img{transform: scale(1.05, 1.05); transition: transform 0.6s ease 0s;}
.list_item:hover .img-box .up-graybox{opacity: 1; filter: alpha(opacity=1);}

.list_item .up-graybox{z-index: 3;}
.list_item .up-graybox{width: 100%;height: 100%;position: absolute;left: 0;top: 0;opacity: 0;filter: alpha(opacity=0);transition: all 0.4s ease 0s;}
.list_item .up-graybox .bgbox{display: block;width: 100%;height: 100%;background-color: #000;opacity: 0.6;filter: alpha(opacity=60);}
.list_item .up-graybox .stit{font-size: 16px;width:90%;text-align: center;position: absolute;left:5%;top: 50%;margin-top: -15px;color: #fff;display: -webkit-box; word-break: break-all;text-overflow: ellipsis;  -webkit-box-orient: vertical; -webkit-line-clamp:2; overflow:hidden; line-height:180%}
.list_item .up-graybox .line{display: inline-block;width: 100px;height: 1px;background-color: #f2f2f2;position: absolute;left: 50%;margin-left: -50px;transition: all 0.6s ease 0s;}
.list_item .up-graybox .linet{top: 0;}
.list_item .up-graybox .lineb{bottom: 0;}
.list_item .up-graybox .out-ico{display: none;width: 26px;height: 26px;position: absolute;right: 20px;top: 20px;}
.list_item:hover .up-graybox .line{width: 6px;margin-left: -3px;opacity: 0.6;filter: alpha(opacity=60);}


.sname{  position:relative; z-index:333; background:#fff;  margin:-25px 18px 0; height:50px; line-height:50px; box-shadow: 0 0px 12px rgb(0 0 0 / 20%);border-radius:12px 3px;transition: all .5s;}
.sname:after { content: '';position: absolute;left: 0;width: 0;top: 0;bottom: 0;transition: all .5s;-moz-transition: all .5s;-webkit-transition: all .5s;z-index: -1;border-radius:12px 3px}

.list_item:hover .sname:after {width: 100%;background: #ed2328; border-color:transparent;}
.list_item:hover .sname{background-color:transparent; color:#fff; border-color:transparent}


.box_item .scontent{padding:18px;line-height: 150%;overflow:hidden; text-align:left ;background:#fff;border-radius:0 0 3px 3px}
.box_item .scontent .date {  font-size:14px; color:#666}
.box_item .scontent .name {   font-size:16px; overflow:hidden; white-space:nowrap; text-overflow: ellipsis; }
.box_item .scontent .font {overflow: hidden;display: -webkit-box; word-break: break-all;text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp:2; color:#999; font-size:12px;margin-top:6px; height:50px}

.box_item{display: block; overflow: hidden;border-radius:3px;margin:12px;position:relative;box-shadow: 0 0px 12px rgb(0 0 0 / 10%);}

.box_item .img-box{display: block;position: relative; overflow: hidden;background:linear-gradient(145deg,#e8e9e8,#e8e9e8 180%);box-shadow: 0 0px 12px rgb(0 0 0 / 10%); }
.box_item .img-box img{width: 100%; transform: translateZ(0px); transition: transform 0.3s ease 0s; }
.box_item:hover .img-box img{transform: scale(1.05, 1.05); transition: transform 0.6s ease 0s;}

.box_item:hover .img-box .outer-graybox{opacity: 1; filter: alpha(opacity=1);}
.box_item .outer-graybox{z-index: 3;}
.box_item .outer-graybox{width: 100%;height: 100%;position: absolute;left: 0;top: 0;opacity: 0;filter: alpha(opacity=0);transition: all 0.4s ease 0s;}
.box_item .outer-graybox .bgbox{display: block;width: 100%;height: 100%;background: #000;opacity: 0.6;filter: alpha(opacity=60);}
.box_item .outer-graybox .stxt{width:70%;text-align: center;position: absolute;left:15%;top:0%; bottom:0;color: #fff; line-height:180%;display:flex;align-items:center; justify-content: center; flex-flow: column;}
.box_item .outer-graybox .stxt h3{font-size: 16px;}
.box_item .outer-graybox .stxt p{overflow: hidden;display: -webkit-box; word-break: break-all;text-overflow: ellipsis;  -webkit-box-orient: vertical; -webkit-line-clamp:2;  font-size:14px;}
.box_item:hover .img-box:after,.box_item:hover .img-box:before {filter:alpha(opacity=100); -moz-opacity:1; -khtml-opacity:1; opacity: 1;z-index:9999;-webkit-transform:scale(1,1);    -moz-transform:scale(1,1);-o-transform:scale(1,1); transform:scale(1,1);}
.box_item .img-box:before { border-top: 1px solid rgba(255,255,255,0.6);    border-bottom: 1px solid rgba(255,255,255,0.6);    -webkit-transform: scale(0,1);    -moz-transform: scale(0,1);    -o-transform: scale(0,1);    transform: scale(0,1);    position: absolute;    top: 24px;    right: 24px;    bottom: 24px;    left: 24px;    content: " ";    opacity:1;    -webkit-transition: opacity 0.5s,-webkit-transform 0.5s;    -moz-transition: opacity 0.5s,-moz-transform 0.5s;    -o-transition: opacity 0.5s,-o-transform 0.5s;    transition: opacity 0.5s,transform 0.5s;}

.box_item .img-box:after {    border-right: 1px solid rgba(255,255,255,0.6);    border-left: 1px solid rgba(255,255,255,0.6);
    -webkit-transform: scale(1,0);    -moz-transform: scale(1,0);    -o-transform: scale(1,0);    transform: scale(1,0);    position: absolute;
    top: 24px;    right: 24px;    bottom: 24px;    left: 24px;    content: " ";    opacity: 0;    -webkit-transition: opacity 0.5s,-webkit-transform 0.5s;    -moz-transition: opacity 0.5s,-moz-transform 0.5s;    -o-transition: opacity 0.5s,-o-transform 0.5s;    transition: opacity 0.5s,transform 0.5s;}







/*Footer*/
.footer_tit {background: #fff;background: url(../images/about1-cont2-top-bg.jpg) no-repeat  center center,linear-gradient(145deg,#e60012,#f55b67 120%) ; display:none;
    height: 175px;
    text-align: center;
	font-size:18PX;  color:#FFF;
    line-height: 175px;
}


.footer{ background:#1c2437 url(../images/aboutus-bg1.png) no-repeat  center  bottom ; overflow:hidden; line-height:200%; border-top:5px #e60012 solid }
.footer .footer-top{margin:60px 24px; overflow:hidden; }

.footer .footer-ul{ width:100%;display:flex; justify-content:space-between;}
.footer .footer-ul li{display:inline-block;vertical-align:top; position:relative;height:100%; display:flex}
.footer .footer-ul li dt{font-size:18px;font-weight: initial; padding-left:24px; margin-bottom:9px;  position:relative}
.footer .footer-ul li dt a{color:#f8f8f8;transition:all 0.3s;}
.footer .footer-ul li dd{font-size:14px;padding-left:36px; position:relative}
.footer .footer-ul li dd a{color:#ccc;	transition:all 0.3s;}
.footer .footer-ul li:after{width:1px; background:linear-gradient(-60deg,transparent,#666  100%); height:100%; content: "";position: absolute;left: 2px; top:10px; z-index:33}
.footer .footer-ul li dd a:before{width:4px; height:4px;background-color: transparent; position: absolute; left:24px; bottom:12px; border-color: #fff; border-style: solid; border-width:2px 2px 0 0;  transform: rotate(45deg); border-radius:1px; content:""; }
.footer .footer-ul li dt a:before{content: ""; position: absolute;bottom:25%;left: 0;    width:5px;    height:50%; background:#e60012;border-radius:3px; z-index:344}


.footer .footer-ul li:first-child  dt{padding-left:0;}
.footer .footer-ul li:first-child dd{padding-left:0px; color:#999}
.footer .footer-ul li:first-child:after{width:0px;}
.footer .footer-ul li:first-child a:before{ display:none}

.footer .footer-ul h3{ font-size:18px;color:#f8f8f8;}
.footer .footer-ul h4{ font-size:14px;color:#DDD;}



.footer-bot{ overflow:hidden;  text-align:center; padding:15px 0;border-top:1px rgba(255,255,255,0.1) solid; }
.footer-bot .link{line-height:180%; text-align:center;font-size:14px;padding:9px 24px;border-bottom:1px #444 solid}
.footer-bot .link a{ color:#ababab }
.footer-bot .link span.line{width: 1px; display:inline-block;	height: 12px;	background: #ccc;		margin: 5px 17px 0;}
.footer-bot  p{	font-size: 12px; line-height:180%;	color: #ababab;padding:9px 24px;}
.footer-bot  p a{	color:#ababab}
.footer-bot p a:hover{}


/*客服*/
.hd_qr{padding:5px 15px;}
.yb_conct{position:fixed;z-index:9999999;top:220px;right:-156px;cursor:pointer;transition:all .3s ease; position:fixed; right:0px}
.yb_bar ul li{width:200px;height:44px;color:#fff;margin-bottom:3px;transition:all .5s ease;overflow:hidden; font-size:14px; line-height: 44px; border-radius:3px ;
position:relative;z-index:9999999;right:-156px;text-align:center }
.yb_bar .yb_top{background:#3a3a3a url(../images/fixCont.png) no-repeat 0 0;text-align:center;text-indent:44px;}
.yb_bar .yb_phone{background:#489ef5 url(../images/fixCont.png) no-repeat 0 -47px;text-align:center;text-indent:44px;}
.yb_bar .yb_mail{background:#70c969 url(../images/fixCont.png) no-repeat 0 -94px;text-align:center;font-size:12px;text-indent:44px;}

.yb_bar .yb_lang{text-indent:0;background:#ff6c00 url(../images/fixCont.png) no-repeat 0 -189px;text-align:center;text-indent:44px;}
.yb_bar .yb_ercode{background:#e60012 url(../images/fixCont.png) no-repeat 0 -141px;}
.yb_lang a{display:inline;color:#fff;}




/**视频*/
.play-btn{ position:relative; display:block; z-index:8888}
.play-btn span{font-size:48px; line-height:60px; position:absolute; top:50%; z-index:335; color:#fff;border:4px #fff solid;border-radius:60px; left:50%; margin-top:-30px; margin-left:-30px; width:60px;
text-align:center ;background:rgba(0,0,0,0.1); animation: ud linear 1.2s infinite;}


.vidcontainer{ position: fixed; width: 100%;height: 100%; top: 0;left: 0; overflow: hidden;display: none;background-color: rgba(0,0,0,0.7); cursor: pointer; z-index:23999;}
.vidcontainer .closevid{ width: 40px; height: 40px;color:#fff; position: absolute; top: 40px; right: 40px; cursor: pointer; transition: all .3s;border:1px #fff solid;border-radius:40px; text-align:center}
.vidcontainer .closevid span{font-size:24px; line-height:40px; }
.vidcontainer video,.vidcontainer iframe{ position: absolute;width: 100%;height: 100%;top: 0; left: 0;background-color: #000; bottom: 0;right: 0; margin: auto;}
.vidcontainer iframe{    background-color: #fff;}
@media (max-width: 767px){
  .vidcontainer .closevid{
    width: .5rem;
    height: .5rem;
  }
}
@media (min-width: 1025px){
    .vidcontainer .closevid:hover{
        transform: rotate(90deg);
    }
}